<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="description" content="">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <!-- The above 4 meta tags *must* come first in the head; any other head content must come *after* these tags -->

  <!-- Title -->
  <title>Original - Lifestyle Blog Template</title>

  <!-- Favicon -->
  <link rel="icon" th:href="@{img/core-img/favicon.ico}" href="img/core-img/favicon.ico">

  <!-- Style CSS -->
  <link rel="stylesheet" th:href="@{./style.css}" href="style.css">

</head>

<body>
<!-- Preloader -->
<div id="preloader">
  <div class="preload-content">
    <div id="original-load"></div>
  </div>
</div>

<div class="coming-soon-area bg-img background-overlay" style="background-image: url(img/bg-img/b9.jpg);">
  <!-- ##### Header Area Start ##### -->
  <header class="header-area">

    <!-- Top Header Area -->
    <div class="top-header">
      <div class="container h-100">
        <div class="row h-100 align-items-center">
          <!-- Breaking News Area -->
          <div class="col-12 col-sm-8">
            <div class="breaking-news-area">
              <div id="breakingNewsTicker" class="ticker">
                <ul>
                  <li><a href="#">Hello World!</a></li>
                  <li><a href="#">Hello Universe!</a></li>
                  <li><a href="#">Hello Original!</a></li>
                  <li><a href="#">Hello Earth!</a></li>
                  <li><a href="#">Hello Colorlib!</a></li>
                </ul>
              </div>
            </div>
          </div>
          <!-- Top Social Area -->
          <div class="col-12 col-sm-4">
            <div class="top-social-area">
              <a href="#" data-toggle="tooltip" data-placement="bottom" title="Pinterest"><i class="fa fa-pinterest" aria-hidden="true"></i></a>
              <a href="#" data-toggle="tooltip" data-placement="bottom" title="Facebook"><i class="fa fa-facebook" aria-hidden="true"></i></a>
              <a href="#" data-toggle="tooltip" data-placement="bottom" title="Twitter"><i class="fa fa-twitter" aria-hidden="true"></i></a>
              <a href="#" data-toggle="tooltip" data-placement="bottom" title="Dribbble"><i class="fa fa-dribbble" aria-hidden="true"></i></a>
              <a href="#" data-toggle="tooltip" data-placement="bottom" title="Behance"><i class="fa fa-behance" aria-hidden="true"></i></a>
              <a href="#" data-toggle="tooltip" data-placement="bottom" title="Linkedin"><i class="fa fa-linkedin" aria-hidden="true"></i></a>
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- Logo Area -->
    <div class="logo-area text-center">
      <div class="container h-100">
        <div class="row h-100 align-items-center">
          <div class="col-12">
            <a href="../templates/index.html" class="original-logo"><img src="img/core-img/logo2.png" alt=""></a>
          </div>
        </div>
      </div>
    </div>
  </header>
  <!-- ##### Header Area End ##### -->

  <!-- ##### Coming Soon Area Start ##### -->
  <div class="coming-soon-timer text-center">
    <div class="container">
      <div class="row">
        <div class="col-12">
          <div class="coming-soon-content">
            <div class="sonar-wrapper">
              <div class="sonar-emitter">
                <div class="sonar-wave">
                </div>
              </div>
            </div>
            <p>our website is coming soon</p>
          </div>
          <div id="clock" class="d-flex align-items-center justify-content-between"></div>
        </div>
      </div>
    </div>
  </div>
  <!-- ##### Coming Soon Area End ##### -->

  <!-- ##### Contact Area Start ##### -->
  <div class="contact-area section-padding-100">
    <div class="container">
      <div class="row justify-content-center">
        <!-- Contact Form Area -->
        <div class="col-12 col-md-10 col-lg-9">
          <div class="contact-form">
            <h5>Get in Touch</h5>
            <!-- Contact Form -->
            <form action="#" method="post">
              <div class="row">
                <div class="col-12 col-md-6">
                  <div class="group">
                    <input type="text" name="name" id="name" required>
                    <span class="highlight"></span>
                    <span class="bar"></span>
                    <label>Name</label>
                  </div>
                </div>
                <div class="col-12 col-md-6">
                  <div class="group">
                    <input type="email" name="email" id="email" required>
                    <span class="highlight"></span>
                    <span class="bar"></span>
                    <label>Email</label>
                  </div>
                </div>
                <div class="col-12">
                  <div class="group">
                    <input type="text" name="subject" id="subject" required>
                    <span class="highlight"></span>
                    <span class="bar"></span>
                    <label>Subject</label>
                  </div>
                </div>
                <div class="col-12">
                  <div class="group">
                    <textarea name="message" id="message" required></textarea>
                    <span class="highlight"></span>
                    <span class="bar"></span>
                    <label>Message</label>
                  </div>
                </div>
                <div class="col-12">
                  <button type="submit" class="btn original-btn">Send Message</button>
                </div>
              </div>
            </form>
          </div>
        </div>

        <div class="col-12 col-md-10 col-lg-3">
          <div class="post-sidebar-area">
            <!-- Widget Area -->
            <div class="sidebar-widget-area">
              <h5 class="title subscribe-title">Subscribe to my newsletter</h5>
              <div class="widget-content">
                <form action="#" class="newsletterForm">
                  <input type="email" name="email" id="subscribesForm" placeholder="Your e-mail here">
                  <button type="submit" class="btn original-btn">Subscribe</button>
                </form>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<!-- ##### Contact Area End ##### -->

<!-- ##### Instagram Feed Area Start ##### -->
<div class="instagram-feed-area">
  <div class="container">
    <div class="row">
      <div class="col-12">
        <div class="insta-title">
          <h5>Follow us @ Instagram</h5>
        </div>
      </div>
    </div>
  </div>
  <!-- Instagram Slides -->
  <div class="instagram-slides owl-carousel">
    <!-- Single Insta Feed -->
    <div class="single-insta-feed">
      <img src="img/instagram-img/1.png" alt="">
      <!-- Hover Effects -->
      <div class="hover-effects">
        <a href="#" class="d-flex align-items-center justify-content-center"><i class="fa fa-instagram"></i></a>
      </div>
    </div>
    <!-- Single Insta Feed -->
    <div class="single-insta-feed">
      <img src="img/instagram-img/2.png" alt="">
      <!-- Hover Effects -->
      <div class="hover-effects">
        <a href="#" class="d-flex align-items-center justify-content-center"><i class="fa fa-instagram"></i></a>
      </div>
    </div>
    <!-- Single Insta Feed -->
    <div class="single-insta-feed">
      <img src="img/instagram-img/3.png" alt="">
      <!-- Hover Effects -->
      <div class="hover-effects">
        <a href="#" class="d-flex align-items-center justify-content-center"><i class="fa fa-instagram"></i></a>
      </div>
    </div>
    <!-- Single Insta Feed -->
    <div class="single-insta-feed">
      <img src="img/instagram-img/4.png" alt="">
      <!-- Hover Effects -->
      <div class="hover-effects">
        <a href="#" class="d-flex align-items-center justify-content-center"><i class="fa fa-instagram"></i></a>
      </div>
    </div>
    <!-- Single Insta Feed -->
    <div class="single-insta-feed">
      <img src="img/instagram-img/5.png" alt="">
      <!-- Hover Effects -->
      <div class="hover-effects">
        <a href="#" class="d-flex align-items-center justify-content-center"><i class="fa fa-instagram"></i></a>
      </div>
    </div>
    <!-- Single Insta Feed -->
    <div class="single-insta-feed">
      <img src="img/instagram-img/6.png" alt="">
      <!-- Hover Effects -->
      <div class="hover-effects">
        <a href="#" class="d-flex align-items-center justify-content-center"><i class="fa fa-instagram"></i></a>
      </div>
    </div>
    <!-- Single Insta Feed -->
    <div class="single-insta-feed">
      <img src="img/instagram-img/7.png" alt="">
      <!-- Hover Effects -->
      <div class="hover-effects">
        <a href="#" class="d-flex align-items-center justify-content-center"><i class="fa fa-instagram"></i></a>
      </div>
    </div>
  </div>
</div>
<!-- ##### Instagram Feed Area End ##### -->

<!-- ##### Footer Area Start ##### -->
<footer class="footer-area text-center">
  <div class="container">
    <div class="row">
      <div class="col-12">

        <!-- Footer Nav Area -->
        <div class="classy-nav-container breakpoint-off">
          <!-- Classy Menu -->
          <nav class="classy-navbar justify-content-center" id="footerNav">

            <!-- Navbar Toggler -->
            <div class="classy-navbar-toggler">
              <span class="navbarToggler"><span></span><span></span><span></span></span>
            </div>

            <!-- Menu -->
            <div class="classy-menu">

              <!-- close btn -->
              <div class="classycloseIcon">
                <div class="cross-wrap"><span class="top"></span><span class="bottom"></span></div>
              </div>

              <!-- Nav Start -->
              <div class="classynav">
                <ul>
                  <li><a href="#">Home</a></li>
                  <li><a href="#">About Us</a></li>
                  <li><a href="#">Lifestyle</a></li>
                  <li><a href="#">travel</a></li>
                  <li><a href="#">Music</a></li>
                  <li><a href="#">Contact</a></li>
                </ul>
              </div>
              <!-- Nav End -->
            </div>
          </nav>
        </div>

        <!-- Footer Social Area -->
        <div class="footer-social-area mt-30">
          <a href="#" data-toggle="tooltip" data-placement="top" title="Pinterest"><i class="fa fa-pinterest" aria-hidden="true"></i></a>
          <a href="#" data-toggle="tooltip" data-placement="top" title="Facebook"><i class="fa fa-facebook" aria-hidden="true"></i></a>
          <a href="#" data-toggle="tooltip" data-placement="top" title="Twitter"><i class="fa fa-twitter" aria-hidden="true"></i></a>
          <a href="#" data-toggle="tooltip" data-placement="top" title="Dribbble"><i class="fa fa-dribbble" aria-hidden="true"></i></a>
          <a href="#" data-toggle="tooltip" data-placement="top" title="Behance"><i class="fa fa-behance" aria-hidden="true"></i></a>
          <a href="#" data-toggle="tooltip" data-placement="top" title="Linkedin"><i class="fa fa-linkedin" aria-hidden="true"></i></a>
        </div>
      </div>
    </div>
  </div>

  <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
  Copyright &copy;<script>document.write(new Date().getFullYear());</script> All rights reserved | This template is made with <i class="fa fa-heart-o" aria-hidden="true"></i> by <a href="https://colorlib.com" target="_blank">Colorlib</a>
  <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->

</footer>
<!-- ##### Footer Area End ##### -->

<!-- jQuery (Necessary for All JavaScript Plugins) -->
<script th:src="@{js/jquery/jquery-2.2.4.min.js}" src="js/jquery/jquery-2.2.4.min.js"></script>
<!-- Popper js -->
<script th:src="@{js/popper.min.js}" src="js/popper.min.js"></script>
<!-- Bootstrap js -->
<script th:src="@{js/bootstrap.min.js}" src="js/bootstrap.min.js"></script>
<!-- Plugins js -->
<script th:src="@{js/plugins.js}" src="js/plugins.js"></script>
<!-- Active js -->
<script th:src="@{js/active.js}" src="js/active.js"></script>

</body>

</html>